<template>
  <!-- <img src="@/assets/images/logo2.png" alt="" /> -->
  <h1>图书商城管理平台</h1>
  <el-button type="danger" plain @click="quit">退出登录</el-button>
</template>
<script setup>
import axios from "axios";
import router from "@/router";
import { ElMessage } from "element-plus";
import { useStore } from "vuex";

const store = useStore();

//退出登录
async function quit() {
  try {
    const response = await axios.post("http://localhost:3000/api/logins/logout")
    await store.dispatch("logout");
    router.push("/login");
    ElMessage.success(response.data.message);
  } catch (error) {
    ElMessage.error(error.message);
  }
}
</script>
<style>
.el-header {
  background-color: #dddfe2;
  color: #333;
  text-align: center;
  line-height: 60px;
  height: 8vh;
  position: relative;
}

.el-header img {
  position: absolute;
  left: 1%;
  top: 12%;
  height: 80%;
}

.el-header h1 {
  position: absolute;
  left: 46%;
  top: -15%;
  font-size: 25px;
}

.el-header .el-button {
  position: absolute;
  right: 1.5%;
  top: 28%;
}
</style>